<script setup lang="ts">
const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false
  },
  label: {
    type: String,
    default: null
  }
})

const emits = defineEmits<{
  (e: 'update:modelValue', v: boolean): void
}>()

function changeValue() {
  emits('update:modelValue', !props.modelValue)
}
</script>
<template>
  <div class="ya-switch">
    <div class="ya-switch-block" :class="{ 'is-active': modelValue }" @click="changeValue" />
    <div v-if="label" class="ya-switch-label">{{ label }}</div>
  </div>
</template>
